<link rel="stylesheet" type="text/css" href="assets/bootstrap-datepicker/css/datepicker.css" />
<!-- 主页-请假管理-新增 -->
<section id="container">
    <!--main content start-->
    <section id="main-content">
        <section class="wrapper">
            <!--state overview end-->
            <div class="row">
                <div class="col-lg-12">
                    <section class="panel">
                        <header class="panel-heading">
                            请假信息
                        </header>
                        <form>
                            <div class="panel-body">
                                <div class="form-group customerForm">
                                    <label class="col-sm-2 control-label">归属部门</label>
                                    <div class="col-sm-10">
                                        <select id="deptCode" class="form-control" ng-model="deptCode" name="deptCode"
                                            certus-required>
                                            <option ng-repeat="x in depts" value="{{x.departmentCode}}">
                                                {{x.departmentName}}</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="form-group customerForm">
                                    <label class="col-sm-2 control-label">请假类型*</label>
                                    <div class="col-sm-10">
                                        <select class="form-control" id="vacationType" name="vacationType"
                                            ng-model="vacationType">
                                            <option value="{{x.vacationType}}" ng-repeat="x in type">{{x.comments}}
                                            </option>
                                        </select>
                                    </div>
                                </div>
                                <div class="form-group customerForm">
                                    <label class="col-sm-2 control-label">请假开始时间*</label>
                                    <div class="col-sm-10">
                                        <div class="row">
                                            <div class="col-lg-8">
                                                <input type="text" class="form-control" value="{{beginTime}}"
                                                    placeholder="开始日期" name="beginTime" id="beginTime">
                                            </div>
                                            <div class="col-lg-4">
                                                <select class="form-control" id="start" name="start" ng-model="start">
                                                    <option value="09:00:00">09:00</option>
                                                    <option value="09:30:00">09:30</option>
                                                    <option value="10:00:00">10:00</option>
                                                    <option value="10:30:00">10:30</option>
                                                    <option value="11:00:00">11:00</option>
                                                    <option value="11:30:00">11:30</option>
                                                    <option value="13:00:00">13:00</option>
                                                    <option value="13:30:00">13:30</option>
                                                    <option value="14:00:00">14:00</option>
                                                    <option value="14:30:00">14:30</option>
                                                    <option value="15:00:00">15:00</option>
                                                    <option value="15:30:00">15:30</option>
                                                    <option value="16:00:00">16:00</option>
                                                    <option value="16:30:00">16:30</option>
                                                    <option value="17:00:00">17:00</option>
                                                    <option value="17:30:00">17:30</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="form-group customerForm">
                                    <label class="col-sm-2 control-label">请假结束时间*</label>
                                    <div class="col-sm-10">
                                        <div class="row">
                                            <div class="col-lg-8">
                                                <input type="text" class="form-control" placeholder="结束日期"
                                                    value="{{endTime}}" name="endTime" id="endTime">
                                            </div>
                                            <div class="col-lg-4">
                                                <select class="form-control" id="end" name="end" ng-model="end">
                                                    <option value="10:00:00">10:00</option>
                                                    <option value="10:30:00">10:30</option>
                                                    <option value="11:00:00">11:00</option>
                                                    <option value="11:30:00">11:30</option>
                                                    <option value="12:00:00">12:00</option>
                                                    <option value="13:00:00">13:00</option>
                                                    <option value="13:30:00">13:30</option>
                                                    <option value="14:00:00">14:00</option>
                                                    <option value="14:30:00">14:30</option>
                                                    <option value="15:00:00">15:00</option>
                                                    <option value="15:30:00">15:30</option>
                                                    <option value="16:00:00">16:00</option>
                                                    <option value="16:30:00">16:30</option>
                                                    <option value="17:00:00">17:00</option>
                                                    <option value="17:30:00">17:30</option>
                                                    <option value="18:00:00">18:00</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="form-group customerForm">
                                    <label class="col-sm-2 control-label">请假总时长*</label>
                                    <div class="col-sm-10">
                                        <div class="row">
                                            <div class="col-lg-4">
                                                <div class="input-group">
                                                    <input type="number" class="form-control" name="vacationDay"
                                                        id="vacationDay" value="{{vacationDay}}" min="1"
                                                        onkeyup="calcHours(this.value)" onblur="calcHours(this.value)">
                                                    <span class="input-group-addon">天</span>
                                                </div>
                                            </div>
                                            <div class="col-lg-4">
                                                <select class="form-control" name="vacationHour" ng-model="vacationHour"
                                                    id="vacationHour" onchange="calcueDay(this.value)">
                                                    <option value="0">0小时</option>
                                                    <option value="1">1小时</option>
                                                    <option value="2">2小时</option>
                                                    <option value="3">3小时</option>
                                                    <option value="4">4小时</option>
                                                    <option value="5">5小时</option>
                                                    <option value="6">6小时</option>
                                                    <option value="7">7小时</option>
                                                    <option value="8">8小时</option>
                                                </select>
                                            </div>
                                            <div class="col-lg-4">
                                                <div class="input-group">
                                                    <span class="input-group-addon">总时长</span>
                                                    <input type="text" class="form-control" disabled certus-required
                                                        value="{{totalHour}}" name="totalHour" id="totalHour">
                                                    <span class="input-group-addon">小时</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="form-group customerForm">
                                    <label class="col-sm-2 control-label">紧急联系电话</label>
                                    <div class="col-sm-10">
                                        <input type="number" class="form-control" value="{{telephone}}"
                                            onblur="tellNo()" certus-required name="telephone" id="telephone">
                                    </div>
                                </div>

                                <div class="form-group customerForm">
                                    <label class="col-sm-2 control-label">请假原因</label>
                                    <div class="col-sm-10">
                                        <textarea class="form-control" maxlength="120" name="comments" certus-required
                                            id="comments">{{comments}}</textarea>
                                    </div>
                                </div>
                                <div class="form-group customerForm">
                                    <label class="col-sm-2 control-label">退回原因</label>
                                    <div class="col-sm-10">
                                        <textarea class="form-control"  maxlength="120"  disabled>{{opinionMsg}}</textarea>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </section>

                    <section class="panel">
                        <div class="panel-body">
                            <p class="default-buttons">
                                <a href="javascript:void(0);" class="button-back btn btn-info"
                                    onclick="window.history.back()">返回</a>
                                <a href="javascript:void(0);" class="button-next  btn btn-success submit">确认提交</a>
                            </p>
                        </div>
                    </section>

                    <section class="panel">
                        <div class="panel-heading">
                            审批记录
                        </div>
                        <div class="panel-body">
                            <ul class="tp-ulst" id="containerUl">
                                <li>
                                    <span>人员姓名</span><span>提交时间</span><span>处理结果</span>
                                </li>
                            </ul>
                        </div>
                    </section>
                </div>
            </div>
        </section>
    </section>
    <!--main content end-->
</section>

<script type="text/javascript" src="assets/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
<script src="js/leave/editLeave.js"></script>
<script src="js/leave/leavaNode.js"></script>
<script type="text/javascript">
    function tellNo() {
        var phone = document.getElementById('telephone').value;
        if (!(/^1[34578]\d{9}$/.test(phone))) {
            layer.msg('手机号码有误，请重填!');
            document.getElementById('telephone').value = '';
            return false;
        }
    }
    $("#beginTime").datepicker({
        format: 'yyyy-mm-dd'
    });

    $("#endTime").datepicker({
        format: 'yyyy-mm-dd'
    });
</script>